<div class="content-section introduction ">
  <div>
    <span class="feature-title">巡检管理<span class="gt">&gt;</span>巡检总览  </span>
  </div>
  <!--
  未开始：#34A4DD
  进行中：#81C046
  按时完成：#00AF4B
  超时未完成：#ED1414
  漏检：#EA2F84
  按时完成有故障：#FFA506
  超时完成有故障：#F44306-->
</div>
<div class="content-section implementation GridDemo ">
  <div class="firstContent">
    <div class="ui-g">
      <div class="ui-g-12">
        <div class="firstTitle">
          <div class="title">当日巡检进度一览</div>
          <div class="rightTitle">
            <span >
                     <span style="padding-left: 5px; padding-right: 5px"  class="span_bg" ></span>
            </span>
          </div>
        </div>
        <div class="listData">
          <div class="listTitle" >
            <div class="titleLeft">巡检内容</div>
            <div class="titleduty">班次</div>
            <!--<div *ngFor="let time of this.tableTime">-->
              <!--<div class="titletime">{{time}}</div>-->
            <!--</div>-->
            <div class="titletime">01:00</div>
            <div class="titletime">02:00</div>
            <div class="titletime">03:00</div>
            <div class="titletime">04:00</div>
            <div class="titletime">05:00</div>
            <div class="titletime">06:00</div>
            <div class="titletime">07:00</div>
            <div class="titletime">08:00</div>
            <div class="titletime">09:00</div>
            <div class="titletime">10:00</div>
            <div class="titletime">11:00</div>
            <div class="titletime">12:00</div>
            <div class="titletime">13:00</div>
            <div class="titletime">14:00</div>
            <div class="titletime">15:00</div>
            <div class="titletime">16:00</div>
            <div class="titletime">17:00</div>
            <div class="titletime">18:00</div>
            <div class="titletime">19:00</div>
            <div class="titletime">20:00</div>
            <div class="titletime">21:00</div>
            <div class="titletime">22:00</div>
            <div class="titletime">23:00</div>
            <div class="titletime">24:00</div>
          </div>
          <div class="listContent"  >
            <!-- <div *ngFor="let table of tableData; let i = index">
              <div class="firstList" *ngIf="i%2 === 0">
                <div class="listTitle" >
                  <div class="titleLeft">{{ table.line_name }}</div>
                  <div class="titleduty">{{ table.num }}</div>
                  <div *ngFor="let item of table.color ">
                    <div class="titletime"  [style.background]="item"></div>
                  </div>
                </div>
              </div>
              <div class="secondList"  *ngIf="i%2 !== 0">
                <div class="listTitle">
                  <div class="titleLeft">{{ table.line_name }}</div>
                  <div class="titleduty">{{ table.num }}</div>
                  <div *ngFor="let item of table.color ">
                    <div class="titletime" [style.background]="item"></div>
                  </div>
                </div>
              </div>
            </div> -->


          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="secondContent">
    <div class="secondLeft">
      <div class="secondTitle">
        <span>整体完成情况</span>
      </div>
      <div class="secondEcharts">
        <!-- <app-first-echarts></app-first-echarts> -->
      </div>
    </div>
    <div class="secondRight">
      <div class="secondTitle">
        <div class="leftTitle">漏检分布情况</div>
        <div class="rightBtn">
          <div class="year">今年</div>
          <div class="month">本月</div>
        </div>
      </div>
      <div class="secondEcharts">
        <div class="leftEcharts">
          <!-- <app-second-echarts *ngIf="this.missInspectionStatus === '今年'"></app-second-echarts> -->
         <!-- <app-second-moth-echarts *ngIf="this.missInspectionStatus === '本月'"></app-second-moth-echarts> -->
        </div>
        <div class="rightEcharts">
          <!-- <app-second-right-echarts *ngIf="this.missInspectionStatus === '今年'"></app-second-right-echarts> -->
          <!-- <app-second-right-moth-echarts *ngIf="this.missInspectionStatus === '本月'"></app-second-right-moth-echarts> -->
        </div>
      </div>
    </div>
  </div>
  <div class="thirdContent">
    <div class="thirdLeft">
      <div class="secondTitle">
        <span>异常设备推移</span>
      </div>
      <div class="secondEcharts">
        <!-- <app-third-echarts></app-third-echarts> -->
      </div>
    </div>
    <div class="thirdRight">
      <div class="secondTitle">
        <div class="leftTitle">异常设备TOP5</div>
        <div class="rightBtn">
          <div class="year"  >今年</div>
          <div class="month" >本月</div>
        </div>
      </div>
      <div class="secondEcharts">
        <!-- <app-fourview-echarts *ngIf="this.topInspectionStatus === '今年'"></app-fourview-echarts> -->
        <!-- <app-four-view-month-echarts *ngIf="this.topInspectionStatus === '本月'"></app-four-view-month-echarts> -->
      </div>
    </div>
  </div>
</div>
